<template>
	<div>
		<el-table :data="tableData">
			<el-table-column v-for="item in tableColumns" :prop="item.prop" :label="item.label"></el-table-column>
		</el-table>
	</div>
</template>

<script setup>
	import { reactive, ref, getCurrentInstance } from 'vue'
	import { useRoute } from 'vue-router'
	
	const route = useRoute()
	const { appContext } = getCurrentInstance();
	const $axios = appContext.config.globalProperties.$axios;
	
	const tableData = ref([])
	const tableColumns = ref([])
	
	const loadTableData = () => {
		console.log('route', route.query)
		$axios.get("/core/load", {
			params: {
				...route.query,
				table: route.query.name
			}
		}).then(res => {
			console.log(res)
			tableColumns.value = res.tableColumns.map(item => {
				return {
					prop: item,
					label: item
				}
			})
			tableData.value = res.tableData
		})
	}
	
	
	
	loadTableData()
</script>

<style>
</style>